<!DOCTYPE html>
<html>

<head>
  <meta name="keywords" content="camicroscope, quip"/>
  <meta charset='utf-8'>
  <meta http-equiv='X-UA-Compatible' content='IE=edge'>
  <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'>

  <title>caMicroscope</title>
  <!-- google material icons css sheet -->
  <link href='../../iconfont/material-icons.css' rel='stylesheet'/>
  <!-- common css START -->
  <link rel='stylesheet' type='text/css' media='all' href='../../css/style.css'/>
  <!-- color picker css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../common/colorpicker/color-picker.css'/>
  <!-- add pure-form css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../common/pureform/pure-form.css'/>
  <link rel='stylesheet' type='text/css' media='all' href='./modelpanel/modelpanel.css'/>
  <!-- common css END -->

  <!-- UI components css START -->
  <!-- message display bar css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/camessage/camessage.css'/>
  <!-- toolbar css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/toolbar/toolbar.css'/>
  <!-- side menu css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/sidemenu/sidemenu.css'/>
  <!-- layers controller css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/layersviewer/layersviewer.css'/>
  <!-- collapsible list css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/collapsiblelist/collapsiblelist.css'/>
  <!-- operation panel css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/operationpanel/operationpanel.css'/>
  <!-- mult selector css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/multselector/multselector.css'/>
  <!-- stylecontextmenu css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/simplecontextmenu/simplecontextmenu.css'/>
  <!-- message queue css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/messagequeue/messagequeue.css'/>
  <!-- loading cover css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/loading/loading.css'/>
  <!-- popup panel css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/popuppanel/popuppanel.css'/>
  <!-- add spyglass css -->
  <link rel='stylesheet' type='text/css' media='all' href='../../components/spyglass/spyglass.css'/>
  <!-- modal box -->
  <link rel="stylesheet" type="text/css" media="all" href="../../components/modalbox/modalbox.css" />
  <!-- Popup -->
  <link rel="stylesheet" type="text/css" media="all" href="../../css/popup.css" />
  <!-- UI components css END -->

  <!-- osd & core css START -->
  <!-- zoom control css -->
   <link rel='stylesheet' type='text/css' media='all' href='../../core/extension/openseadragon-zoom-control/openseadragon-zoom-control.css'/>
   <!-- mesurement tool css -->
   <link rel='stylesheet' type='text/css' media='all' href='../../core/extension/openseadragon-measurement-tool/openseadragon-measurement-tool.css'/>
   <!-- osd & core css END -->

   <!-- Check If we're logged in ok, otherwise, log in for us -->
   <script src='../../common/authChecker.js'></script>
   <script>
     __auth_check(2)
   </script>
  <!-- tensorflow.js -->
  <script type='text/javascript' src='../../common/tf.min.js'></script>
  <!-- tfjs visulisation -->
  <script type='text/javascript' src='../../common/tfjs-vis.min.js'></script>
   <!--  common js START -->
   <!-- util.js -->
  <script type='text/javascript' src='../../common/util.js'></script>
  <script type='text/javascript' src='../../common/DrawHelper.js'></script>
  <script type='text/javascript' src='../../common/simplify.js'></script>
  <script type='text/javascript' src='../../common/paths.js'></script>
  <!-- add pure-form script -->
  <script type='text/javascript' src='../../common/pureform/document-register-element.js'></script>
  <script type='text/javascript' src='../../common/pureform/pure-form.js'></script>
  <!-- color picker js -->
  <script type='text/javascript' src='../../common/colorpicker/color-picker.js'></script>
  <!-- sortable js -->
  <script type='text/javascript' src='../../common/sortable/Sortable.js'></script>
  <!-- AJV json validator engine -->
  <script type='text/javascript' src='../../common/ajv.js'></script>
  <!-- IDB helper -->
  <script type='text/javascript' src='../../common/idb.js'></script>
  <!--  common js END -->

  <!--  components js START -->
  <!-- message display js -->
  <script type='text/javascript' src='../../components/camessage/camessage.js'></script>
  <!-- toolbar js -->
  <script type='text/javascript' src='../../components/toolbar/toolbar.js'></script>
  <!-- sidemenu js -->
  <script type='text/javascript' src='../../components/sidemenu/sidemenu.js'></script>
    <!-- collapsible list js -->
    <script type='text/javascript' src='../../components/collapsiblelist/collapsiblelist.js'></script>
  <!-- layers controller js -->
  <script type='text/javascript' src='../../components/layersviewer/layersviewer.js'></script>
  <!-- operation panel js -->
  <script type='text/javascript' src='../../components/operationpanel/operationpanel.js'></script>
  <!-- loading cover js -->
  <script type='text/javascript' src='../../components/loading/loading.js'></script>
  <!-- stylecontextmenu js -->
  <script type='text/javascript' src='../../components/simplecontextmenu/simplecontextmenu.js'></script>
  <!-- popup panel js -->
  <script type='text/javascript' src='../../components/popuppanel/popuppanel.js'></script>
  <!-- message queue js -->
  <script type='text/javascript' src='../../components/messagequeue/messagequeue.js'></script>
  <!-- mult selector js -->
  <script type='text/javascript' src='../../components/multselector/multselector.js'></script>
  <!-- spyglass -->
  <script type='text/javascript' src='../../components/spyglass/spyglass.js'></script>
  <!-- script type='text/javascript' src='modelpanel/slider.js'></script -->
  <script type='text/javascript' src='./modelpanel/modelpanel.js'></script>
  <!-- modal box -->
  <script type="text/javascript" src="../../components/modalbox/modalbox.js"></script>
  <!--  components js END -->


  <!-- osd & core js START -->
  <script type='text/javascript' src='../../core/openseadragon/openseadragon.js' ></script>
  <script type='text/javascript' src='../../core/openseadragon-imaginghelper.min.js'></script>
  <script type='text/javascript' src='../../core/openseadragon-scalebar.js'></script>
  <script type='text/javascript' src='../../core/openseadragonzoomlevels.js'></script>

  <!-- core (package/ext) libs -->
  <script type='text/javascript' src='../../core/StatesHelper.js'></script>
  <script type='text/javascript' src='../../core/Validation.js'></script>
  <script type='text/javascript' src='../../core/Store.js'></script>
  <script type='text/javascript' src='../../core/CaMic.js'></script>

  <script type='text/javascript' src='../../core/extension/openseadragon-canvas-draw-overlay.js'></script>
  <script type='text/javascript' src='../../core/extension/openseadragon-overlays-manage.js'></script>
  <script type='text/javascript' src='../../core/extension/openseadragon-measurement-tool/openseadragon-measurement-tool.js'></script>
  <script type='text/javascript' src='../../core/extension/openseadragon-zoom-control/openseadragon-zoom-control.js'></script>


  <!-- business js -->
  <script type='text/javascript' src='../../common/PathdbMods.js'></script>
  <script type='text/javascript' src='../../common/LocalStore.js'></script>
  <script type='text/javascript' src='../../common/NanoBorbMods.js'></script>
  <script type='text/javascript' src='../../common/dynamicLoadScript.js'></script>
  <!-- <script src="../../dist/imgbox_package.js"></script> -->

  <!--
  <script src='../viewer/uicallbacks.js'></script>
  <script src='../viewer/dataloaders.js'></script>
  <script src='../viewer/init.js'></script>
  -->

  <!-- segment css -->
  <link rel="stylesheet" type='text/css' href='./model.css'>

</head>
<body>
<!-- toolbar -->
<div id='ca_tools'></div>
<div id='main_viewer' class='main'></div>
<div id="upload_panel"></div>
<div id="model_info"></div>
<div id="help"></div>
<div id="chngClass"></div> <!-- modal box to change class list -->
<div id="popup-container"></div>
</body>

<script src='model.js'></script>

<script type="text/javascript">
    if(detectIE()){
      createWarningText('You are using an <strong>IE/Edge</strong> browser that may be lead to erratic behavior on caMicroscope. Please switch to <a href="https://www.google.com/chrome/">Chrome</a>, <a href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a> or <a href="https://www.apple.com/safari/">Safari</a> browser to improve your experience.');
    }
    //Loading.open(document.body, 'CaMicroscope is initializing...');
    // get slide id from url
    $D.params = getUrlVars();

    // load if we have at least one slide query element
    if($D.params && $D.params.slideId){
      // normal initialization starts
      document.addEventListener('DOMContentLoaded', initialize);
    }
    else if ($D.params && ($D.params.slide || $D.params.specimen ||$D.params.study || $D.params.location)){
      let STORE = new Store()
      STORE.findSlide($D.params.slide, $D.params.study, $D.params.specimen, $D.params.location).then(x=>{
        let offset = parseInt($D.params.offset,10) || 0;
        if(x.length == 0 || offset >= x.length){
          redirect($D.pages.table,'No Slide Found. Redirecting to Table.');
        } else {
          newParams = $D.params
          delete newParams.data
          delete newParams.slide
          delete newParams.location
          delete newParams.offset
          newParams.slideId = x[offset]['_id']['$oid']
          newUrl = window.location.href.split("?")[0] + "?" + objToParamStr(newParams)
          window.location.href = newUrl
        }
      }).catch(e=>{
        console.warn(e)
        redirect($D.pages.table,'Redirecting to Table.');
      })
      // find the associated slideID
      // open viewer with that slideID
    }
    else {
      redirect($D.pages.table,'Slide is undefined. Redirecting to Table.');
    }

    // get states parameters
    if($D.params.states)
      $D.params.states = StatesHelper.decodeStates($D.params.states);
</script>
</html>
